import { Component,createRef } from "react";
class Son extends Component{

  render(){
    test=()=>{
      console.log(this);
    }
    return(
      <div>
        <h2>儿子组件</h2>
      </div>
    )
  }
}
class App extends Component{

  /**
   * 非受控组件：
   * 类似vue模板中使用的ref
   * 
   */
h1=createRef();
Son=createRef()
getDom=()=>{
  // console.log("h1",this.h1);
  // this.h1.current.style.border="10px solid red"
  console.log("子组件实例：", this.son.current);
  this.son.current.test()
}
render(){
  return (
    <div>
      {/* 2.绑定ref对象 */}
      <h1 ref={this.h1}>非受控组件</h1>
      <p>
      <button onClick={this.getDom}>获取h1dom</button>
      </p>
     <Son ref={this.son}/>
    </div>
  )
}

}
export default  App